
<template>
  <div>
    <van-tabbar v-model="active">
      <van-tabbar-item to="/index" >
        <span>首页</span>
        <template #icon="props">
          <img :src="props.active ? indexIcon.active : indexIcon.inactive" />
        </template>
      </van-tabbar-item>
      
    <van-tabbar-item to="/course" >
        <span>课程</span>
        <template #icon="props">
          <img :src="props.active ? courseIcon.active : courseIcon.inactive" />
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/record">
        <span>约课记录</span>
        <template #icon="props">
          <img :src="props.active ? recordIcon.active : recordIcon.inactive" />
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/practice">
        <span>练习</span>
        <template #icon="props">
          <img :src="props.active ? practiceIcon.active : practiceIcon.inactive" />
        </template>
      </van-tabbar-item>
      <van-tabbar-item to="/userIndex">
        <span>我的</span>
        <template #icon="props">
          <img :src="props.active ? userIcon.active : userIcon.inactive" />
        </template>
      </van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: "",
  components: {},
  data() {
    return {
      // token:localStorage.getItem('msmktoken')||[],
      active: 0,
      indexIcon: {
        active: require("../assets/theme-img/home-active.png"),
        inactive: require("../assets/theme-img/home.png"),
      },
       courseIcon: {
        active: require("../assets/theme-img/course-active.png"),
        inactive: require("../assets/theme-img/course.png"),
      },
       recordIcon: {
        active: require("../assets/theme-img/home-active.png"),
        inactive: require("../assets/theme-img/home.png"),
      },
       practiceIcon: {
         active: require("../assets/theme-img/course-active.png"),
        inactive: require("../assets/theme-img/course.png"),
      },
       userIcon: {
        active: require("../assets/theme-img/home-active.png"),
        inactive: require("../assets/theme-img/home.png"),
      },
    };
  },
  created() {},
  mounted() {},
  methods: {},
};
</script>
<style scoped lang='scss'>
</style>
